<template>
	<view>
		<map :latitude="addrDel.latitude" :longitude="addrDel.longitude" :show-location='true'
			@markertap="clickMarkertap" :circles='circles' :markers="markers"
			style="width: 100%; height: calc(100vh - 120upx);"></map>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				visible: false,
				addrDel: {

				},
				markers: [{
						latitude: 34.79987,
						longitude: 113.66072,
						iconPath: '/static/newProject/location.png',
						id: 1,
						title: "11",
						width: 40,
						height: 40
					},
					{
						latitude: 34.79987,
						longitude: 113.66172,
						iconPath: '/static/newProject/location.png',
						id: 2,
						title: "22",
						width: 40,
						height: 40
					},
				],
				lng: '',
				lat: '',
				circles: []
			}
		},
		// 分享好友
		onShareAppMessage() {
			return {
				title: '鲲鱬云',
				path: JSON.parse(uni.getStorageSync('gitH5Qrcode')),
			}
		},
		// 分享朋友圈
		onShareTimeline() {
			return {
				title: '鲲鱬云',
				query: JSON.parse(uni.getStorageSync('gitH5Qrcode')),
			}
		},
		onLoad() {
			let that = this
			uni.getSystemInfo({
				success(res) {
					if (!res.locationEnabled || !res.locationAuthorized) {
						uni.showToast({
							title: '请确保手机系统定位已开启',
							icon: 'none',
							duration: 2000,
						})
					}
				}
			})
			uni.getLocation({
				type: 'wgs84',
				geocode: true, //设置该参数为true可直接获取经纬度及城市信息
				success: (res) => {
					that.addrDel = res;
					console.log(res)
					that.lng = res.longitude
					that.lat = res.latitude
					that.nearDevice()
				},
				fail: function() {
					uni.showToast({
						title: '获取地址失败，将导致部分功能不可用',
						icon: 'none'
					});
				}
			});
		},
		methods: {
			clickMarkertap(e) {
				console.log(e)
				this.visible = true
			},
			nearDevice() {
				let {
					lng,
					lat
				} = this
				this.$fun.ajax.post('butt/nearDevice', {
					lng,
					lat
				}).then(res => {
					// console.log(res)
					res.data.map((item) => {
						item.iconPath = '/static/newProject/location.png'
						item.latitude = item.lat
						item.longitude = item.lng
						item.width = 40
						item.height = 40
						item.callout = {
							content: ''
						}
						item.color = '#ffffff'
						item.fillColor = '#5990FF'
						item.radius = 10
					})
					this.markers = res.data
					this.circles = res.data
				})
			}

		}
	}
</script>

<style>

</style>